<template>
    <div>
        <Banner :sightName="list.data.sightName" :bannerImg="list.data.bannerImg" :bannerImgs="list.data.gallaryImgs"></Banner>
        <keep-alive>
            <Header></Header>
        </keep-alive>
        <div class="content">
            <List :list="list.data.categoryList"></List>
        </div>
    </div>
</template>

<script>
import Banner from "../components/detail/Banner.vue";
import Header from "../components/detail/Header.vue";
import List from '../components/detail/List.vue'
import list from '../assets/mock/detail.json'
export default {
  components: {
    Banner,
    Header,
    List
  },
  data() {
    return {
      list
    };
  },
  methods:{
     
  },
  mounted(){
      console.log(this.list);
  }
};
</script>

<style lang="scss" scoped>
.content {
  height: 50rem;
}
</style>